import React from 'react';
import {Text, View} from 'react-native';
import {WhiteSpace} from '@ant-design/react-native';

const PlaceHolder = props => (
  <View
    style={{
      backgroundColor: '#eee',
      height: 30,
      alignItems: 'center',
      justifyContent: 'center',
    }}
    {...props}>
    <Text style={{color: '#bbb'}}>Block</Text>
  </View>
);
export default class WhiteSpacePage extends React.Component {

  constructor() {
    super();
  }

  render() {
    return (
      <View>
        <WhiteSpace size="xs"/>
        <PlaceHolder/>

        <WhiteSpace size="sm"/>
        <PlaceHolder/>

        <WhiteSpace/>
        <PlaceHolder/>

        <WhiteSpace size="lg"/>
        <PlaceHolder/>

        <WhiteSpace size="xl"/>
        <PlaceHolder/>
      </View>
    );
  }
}
